import React, { useEffect } from 'react'

function Com() {
  useEffect(() => {
    // hello world案例
    // var map = new window.BMapGL.Map("container");
    // // 创建地图实例 
    // var point = new window.BMapGL.Point(116.404, 39.915);
    // // 创建点坐标 
    // map.centerAndZoom(point, 15);
    // // 初始化地图，设置中心点坐标和地图级别 

    // 根据起终点经纬度查询驾车路线
    // var map = new window.BMapGL.Map("container");
    // map.centerAndZoom(new window.BMapGL.Point(116.404, 39.915), 11);

    // var p1 = new window.BMapGL.Point(116.301934,39.977552);
    // var p2 = new window.BMapGL.Point(116.508328,39.919141);

    // var driving = new window.BMapGL.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
    // driving.search(p1, p2);

    // 查询公交地铁路线
    var map = new window.BMapGL.Map("container");            // 创建Map实例
        map.centerAndZoom(new window.BMapGL.Point(116.404, 39.915), 12);

        var busline = new window.BMapGL.BusLineSearch(map,{
            renderOptions:{map:map,panel:"r-result"},
            onGetBusListComplete: function(result){
                if(result) {
                    var fstLine = result.getBusListItem(0);//获取第一个公交列表显示到map上
                    busline.getBusLine(fstLine);
                }
            }
        });
        function busSearch(){
            var busName = 107;
            busline.getBusList(busName);
        }
        setTimeout(function(){
            busSearch();
        },1500);
  }, [])
  return (
    <div>
      <h1>百度地图</h1>
      <div id="container" style={{ width: '100%', height: 500}}></div>
      <div id='r-result'></div>
    </div>
  )
}

export default Com


